<div class="child-box">
    <div class="layui-card">
        <div class="layui-card-body">
            <div class="order-success">
                <i class="iconfont iconchenggong"></i>
                <dd style="font-weight: 700; font-size: 22px;word-wrap: break-word;word-break: break-all;margin-top: 20px">订单已提交</dd>
                <dd style="font-size: 16px;margin-top: 10px">我司已收到您的订单：<span class="tcolor" style="font-weight: 700;" id="docNo"></span>，正在为您加急处理。</dd>
                <dd style="font-size: 14px;">订单全程跟踪通知将会短信通知到：
                    <span class="tcolor" id="phoneNo"></span>
                    <span class="scanWx" style="display: none;">，您也可以右边扫码绑定微信登录，关注芯达通接收通知状态。</span>
                    <span class="scanWxSuccess" style="display: none;">，芯达通微信公众平台也将实时通知订单状态。</span>
                </dd>
                <dd style="height: 25px">
                    <hr style="background:linear-gradient(to left, #ffeb3b, #0ba9f9, #ffeb3b); height:2px;border: none">
                </dd>
                <dd>
                    <button class="layui-btn success-btn" id="success-detail">订单详情</button>
                    <button class="layui-btn success-btn" id="success-show-cost">查看费用</button>
                    <button class="layui-btn success-btn" id="success-commit-pay">提交付汇</button>
                    <button class="layui-btn success-btn" lay-href="/order/list">返回列表</button>
                </dd>
            </div>
            <div class="weixin-bind" style="display: none;">
                <img id="wxQrCode"/>
                <div><i class="iconfont iconweixin"></i>扫码关注“芯达通”绑定微信登录，及时接收通知状态</div>
            </div>
        </div>
    </div>
</div>
<style type="text/css">
    .order-success{
        text-align: center;
        padding: 40px 0;
    }
    .order-success i{
        font-size: 80px;
        line-height: 80px;
        font-weight: bold;
        color: #07c160;
    }
    .success-btn {
        border-radius: 20px;
        background-color: #fff;
        color: #0ba9f9;
        border: 1px solid;
        height: 32px;
        min-width: 100px;
    }
    .success-btn:hover{
        background-color: #0ba9f9;
        color: #fff;
    }
    .weixin-bind{
        position: absolute;top: 8px;right: 10px;
        width: 160px;
        text-align: center;
    }
    .weixin-bind img{
        height: 140px;
    }
    .weixin-bind i{
        color: #07c160;
        margin-right: 6px;
    }
</style>
<script>
    layui.use('com',function () {
        var $ = layui.jquery,
            com=layui.com,
            setter=layui.setter,
            request=layui.request,
            search = layui.router().search,
            fn = {
                scanTimer:null,
                wxCode:'',
                startScan:function () {
                    fn.scanTimer = setInterval(function () {
                        clearInterval(fn.scanTimer);
                        com.clearTask(fn.scanTimer);
                        if(com.isNotEmpty(fn.wxCode)){
                            request.send({
                                type: 'POST'
                                , contentType: 'application/x-www-form-urlencoded;charset=utf-8'
                                , showLoading: false
                                , url: '/scm/auth/checkBind'
                                , data: {'code':fn.wxCode}
                            }).then(res =>{
                                let data = res.data;
                                if(res.data != null) {
                                    if(res.data.code == 2) {
                                      //提示绑定成功
                                      layer.msg(res.data.msg);
                                      $(".scanWx").hide();
                                      $(".weixin-bind").hide();
                                      $(".scanWxSuccess").show();
                                    } else if (res.data.code == 1 || res.data.code == 4 || res.data.code == 5) {
                                        //重新刷新二维码
                                        layer.msg(res.data.msg);
                                        fn.checkUserBindWxUnion();
                                    } else {
                                        fn.startScan();
                                    }
                                } else {
                                    fn.startScan();
                                }
                            }).catch(res =>{
                                //清除定时检查是否绑定定时器
                                $(".weixin-bind").hide();
                                clearInterval(fn.scanTimer);
                                com.clearTask(fn.scanTimer);
                            });
                        }
                    },1000);
                    com.addTask(fn.scanTimer);
                
                },
                genTempQrcode:function(){
                    request.postForm('/scm/wx/genTempQrcode',{'code':fn.wxCode}).then(res =>{
                       $('#wxQrCode').attr({'src':'https://mp.weixin.qq.com/cgi-bin/showqrcode?ticket='.concat(res.data)});
                       fn.startScan();
                   });
                },
                checkUserBindWxUnion:function(){
                    request.postForm('/scm/auth/checkUserBindWxUnion').then(res=>{
                        if(com.isNotEmpty(res.data)) { //没有绑定微信
                            $(".scanWx").show();
                            $(".weixin-bind").show();
                            fn.wxCode = res.data;
                            fn.genTempQrcode();
                        } else {
                            $(".scanWxSuccess").show(); 
                        }
                    });
                }
            };
        fn.checkUserBindWxUnion();
        $('#success-detail').click(function () {
            location.hash = '/order/detail/id='+search.id;
        });
        $('#success-show-cost').click(function () {
            location.hash = '/order/printCost/id='+search.id;
        });
        $('#success-commit-pay').click(function () {
            location.hash = '/finance/payApply/id='+search.id;
        });
        $('#docNo').html(search.docNo);
        $('#wechatName').html(setter.data.wechatName);
        let phone = com.getUser().loginInfo.phone;
        $('#phoneNo').html(phone.substr(0,3).concat('****').concat(phone.substr(7,4)));
    });
</script>